body{
    background-color: #bfa;
}
//变量：在变量中可以储存一个任意的值
//并且我们可以在需要的时候，任意的修改变量中的值
//变量的语法：@变量名:数值;
@a:100px;
@b:#bfa;
@c:box6;

.box5{
    //像这样可以直接这么用
    width: @a;
}
//作为类名使用,或者一部分值去使用，要这么用
.@{c}{

}
//变量发生重名时，会优先使用比较近的那个
//在变量声明前就可以用变量

.box1{
    //在box1里面为box1设置hover要这么设置
    //此时&表示所在{}的元素
    &:hover{}
}
.p1{
    //在less中可以对数据直接进行运算
    width: 10px+10px;
    height: 10px;
}
//:extend() 对当前选择器扩展指定选择器的样式（选择器分组）
.p2:extend(.p1){
    //这样p2既可以有p1的样式，又可以新增样式
}
.p3{
    //这样可以直接对指定的样式进行引用,这里就相当于将p1的样式进行了复制
    .p1();
}
//使用类选择器时可以在选择器后面添加一个括号，这时我们实际上就创建了一个mixins
.p4(){
    width: 100px;
    height: 100px;
    background-color: #fff;
}
.p5{
    .p4();
}
//混合函数 在混合函数中可以直接设置变量 :100px 表示是默认值，可以在后面不用输入值用默认的值
.text(@w:100px){
    width: @w;
    height: 100px;
}
//这样就可以根据需求改，可以传多个函数，但是也需要按顺序传参数
div{
    .text(200px)
}
//可以将其他的less引用
// @import "xxx.less";
